﻿@model List<Springwater.Business.ViewModels.FenykepModel>

<div id="slider">
    <table>
        <tr>
            <td><div id="photo_container"></div></td>
        </tr>
        <tr>
            <td><div id="photo_index"></div></td>
        </tr>
    </table>
</div>

<script type="text/javascript">

    var carouselImages = [ @Html.Raw(string.Join(",", Model.Select(f => string.Format("\"{0}\"", Url.Content(f.Path))).ToArray())) ];
    var titleList = [ @Html.Raw(string.Join(",", Model.Select(f => string.Format("\"{0}-{1}\"", f.Szerzo, f.Datum)).ToArray())) ];
  var carouselIndex = 1;
  var carouselMax = @Model.Count;

  $(function () {
      $("#photo_container").isc({
          imgArray: carouselImages
      });

      $("#slider").on("click", "[id=swipe_nav_next]", function () { 
          if (carouselIndex < carouselMax) {
              carouselIndex = carouselIndex + 1;
          }

          $("#photo_index").html(titleList[carouselIndex-1]);
      });

      $("#slider").on("click", "[id=swipe_nav_prev]", function () {
          if (carouselIndex > 1) {
              carouselIndex = carouselIndex - 1;
          }

          $("#photo_index").html(titleList[carouselIndex-1]);
      });

      if (titleList.length > 0)
      {
          $("#photo_index").html(titleList[0]);
      }

      $("#count_container").hide();

  });
</script>
